<template>
  <div class="followup_page">

    <!-- 客户资料 开始 -->
    <div class="base_info">

      <div class="base_left">
        <div class="base_top">
          <div class="name_top_box">
            <!-- 姓名、头像 开始 -->
            <div class="name_box">
              <div class="city">
                <span>{{ selectItem.city && selectItem.city.length > 2 ? selectItem.city.slice(0, 2) : selectItem.city
                }}</span>
              </div>
              <div class="">
                <div class="name">
                  <span>{{ selectItem.name }}</span>
                  <img src="@/assets/images/male.png" alt="" v-if="selectItem.gender == '男' || selectItem.gender == 1" />
                  <img src="@/assets/images/female.png" alt=""
                    v-else-if="selectItem.gender == '女' || selectItem.gender == 2">
                  <img src="@/assets/images/unknown.png" alt="" v-else>
                  <el-button type="primary" size="mini" class="btn" @click="lockUser(selectItem)">{{selectItem.lock == 1?'取消锁定':'锁定'}}</el-button>
                </div>
                <div class="mobile">
                  {{ selectItem.mobile }}

                  <!-- <i class="el-icon-mobile-phone" style="color:#f00;cursor: pointer;font-size:14px;"></i> -->
                </div>
                <div class="counselor">
                  <span class="pre">持有人：</span>
                  <div class="txt">
                    <span class="name">{{ selectItem.employee ? selectItem.employee.name : '' }}</span>
                  </div>
                </div>
              </div>
              <!-- 姓名、头像 end -->
            </div>
            <div class="link_box">
              <el-button type="primary" class="btn" size="small" :disabled="isFirstCustomer()"
                @click="lookPrevCustomer()">上一个客户</el-button>
              <el-button type="primary" class="btn" size="small" :disabled="isLastCustomer()"
                @click="lookNextCustomer()">下一个客户</el-button>
            </div>
          </div>

          <!-- 右侧信息 开始 -->
          <div class="user_info new_user_info">
            <div class="right_btn">
              <el-button type="primary" size="mini" @click="callPhone(selectItem)">一键拨号</el-button>
              <el-button type="primary" size="mini" @click="goSign(0)">签约</el-button>
              <el-button type="primary" size="mini" @click="goFollow(selectItem)">进件</el-button>
              <el-button type="primary" size="mini" @click="joininPublicPool">加入公共池</el-button>
              <el-button type="primary" size="small" @click="openBookDialog()">预约跟进</el-button>
            </div>
            <div class="left_info">
              <div class="static_info">
                <div class="cell">
                  <span class="pre">入库时间：</span>
                  <div class="txt">{{ selectItem.createDate }}</div>
                </div>
                <div class="cell">
                  <span class="pre">分配时间：</span>
                  <div class="txt">{{ selectItem.distributeDate }}</div>
                </div>
                <div class="cell">
                  <span class="pre">最后跟进时间：</span>
                  <div class="txt">{{ selectItem.updateDate }}</div>
                </div>
                <div class="cell">
                  <span class="pre">需求金额：</span>
                  <div class="txt">{{ selectItem.need || '0.00' }}</div>
                </div>
                <div class="cell">
                  <span class="pre">签约额度：</span>
                  <div class="txt">{{ selectItem.contractAmount || '0.00' }}</div>
                </div>
                <div class="cell">
                  <span class="pre">在审件金额：</span>
                  <div class="txt">{{ selectItem.importAmount || '0.00' }}</div>
                </div>
                <!-- <div class="cell">
                  <span class="pre">在审件佣金：</span>
                  <div class="txt">{{selectItem.importBrokerage||'0.00'}}</div>
                </div> -->
              </div>
              <div class="cell">
                <span class="pre">客户星级：</span>
                <div class="txt">
                  <el-tag size="small" class="el_tag" v-for="(item, index) in checkList" :key="index">{{ item.name
                  }}</el-tag>
                  <el-tag size="small" class="el_tag" type="primary" effect="dark" @click="openTagDialog()">+设置星级</el-tag>
                </div>
              </div>
            </div>
          </div>
          <!-- 右侧信息 end -->
        </div>

        <!-- <div class="static_info">

        </div> -->

        <!-- 客户状态 开始 -->
        <div class="steps_box">
          <el-steps :active="Number(selectItem.progress)" finish-status="success">
            <el-step v-for="(item, index) in statusList" :key="index" :title="item.desc"
              @click.native="editProgress(item)"></el-step>
          </el-steps>
        </div>
        <!-- 客户状态 end -->
      </div>

    </div>
    <!-- 客户资料 end -->

    <el-tabs v-model="activeName">
      <!-- 基本资料 开始 -->
      <el-tab-pane label="基本资料" name="1">
        <el-form class="el_form" :model="selectItem" size="small" label-width="120px">
          <div class="first_line">
            <el-form-item label="姓名：">
              <!-- <span class="name">{{selectItem.name}}</span> -->
              <!-- <el-button type="primary" size="mini" @click="callPhone(selectItem)">一键拨号</el-button>
            <el-button type="primary" size="mini" :disabled="disabledSign()" @click="goSign()">签约</el-button>
            <el-button type="primary" size="mini">电子签约</el-button>
            <el-button type="primary" size="mini" @click="openDialog">标记为第三方产品</el-button> -->
              <el-input v-model="selectItem.name" placeholder="请输入姓名"></el-input>
            </el-form-item>
            <el-form-item label="性别：">
              <!-- <span>{{showFollowProcess(selectItem.progress)}}</span> -->
              <el-select v-model="selectItem.sex" placeholder="请选择状态">
                <el-option label="男" :value="1" />
                <el-option label="女" :value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="城市：">
              <city-select v-model="selectItem.city"></city-select>
            </el-form-item>
            <el-form-item label="状态：">
              <el-select v-model="selectItem.progress" placeholder="请选择状态">
                <el-option v-for="(item, index) in statusList" :key="index" :label="item.desc" :value="item.status" />
              </el-select>
            </el-form-item>
          </div>
          <!-- <el-form-item label="电话：">
            <span>{{selectItem.mobile}}</span>
          </el-form-item> -->

          <!-- <el-form-item label="入库日期：">
            <span>{{selectItem.createDate}}</span>
          </el-form-item>
          <el-form-item label="分配日期：">
            <span>{{selectItem.distributeDate}}</span>
          </el-form-item> -->
          <el-form-item v-for="(item, fieldIndex) in fieldList" :key="fieldIndex" :label="`${item.fieldName}：`">
            <template v-if="item.type === 2">
              <el-select v-model="selectItem['field' + (fieldIndex + 1)]" clearable :placeholder="item.fieldName">
                <el-option v-for="kitem in item.value" :key="kitem" :label="kitem" :value="kitem" />
              </el-select>
            </template>
            <template v-else>
              <el-input v-model="item.value1" :placeholder="item.fieldName"></el-input>
            </template>
          </el-form-item>
          <el-form-item label="客户条件" class="el_long">
            <el-input type="textarea" :rows="5" :resize="inputResize" v-model="selectItem.remark"
              placeholder="请输入内容"></el-input>
          </el-form-item>
          <!-- <el-form-item label="备注信息" class="el_long">
            <el-input type="textarea" :rows="5" :resize="inputResize" v-model="selectItem.remark" placeholder="请输入内容"></el-input>
          </el-form-item> -->
          <el-form-item label="跟进记录" class="el_long">
            <div class="textarea_box">
              <div class="area_box">
                <el-input type="textarea" class="" :rows="3" :resize="inputResize" v-model="input"
                  placeholder="请输入跟进记录，不超过50个字"></el-input>
              </div>
              <div class="follow_btn">
                <el-button type="primary" size="small" :disabled="!input" @click="saveInfo('follow')">保存跟进记录</el-button>
                <el-button type="primary" size="small" @click="openBookDialog()">预约跟进</el-button>
              </div>
            </div>
            <div class="follow_list">
              <div class="cell" v-for="(item, index) in selectItem.remarkList" :key="index">
                <div class="title">
                  <span class="name">{{ item.remark }}</span>
                  <span class="time">{{ item.createBy }}</span>
                  <span class="time">{{ item.updateDate }}</span>
                  <!-- <span>发布跟进记录：</span> -->
                </div>
                <!-- <div class="txt_content">
                  {{item.remark}}
                </div> -->
              </div>
            </div>
          </el-form-item>

        </el-form>
      </el-tab-pane>
      <!-- 基本资料 end -->
      <!-- 跟进记录 开始 -->
      <!-- <el-tab-pane label="跟进记录" name="2">
        <el-scrollbar class="el_scroll">
          <div class="textarea_box">
            <div class="area_box">
              <el-input type="textarea" class="" :rows="3" :resize="inputResize" v-model="input" placeholder="请输入跟进记录，不超过50个字"></el-input>
            </div>
            <div class="follow_btn">
              <el-button type="primary" size="small" :disabled="!input" @click="saveInfo('follow')">保存跟进记录</el-button>
              <el-button type="primary" size="small" @click="openBookDialog()">预约跟进</el-button>
            </div>
          </div>
          <div class="follow_list">
            <div class="cell" v-for="(item,index) in selectItem.remarkList" :key="index">
              <div class="title">
                <span class="name">{{item.createBy}}</span>
                <span class="time">{{item.updateDate}}</span>
                <span>发布跟进记录：</span>
              </div>
              <div class="txt_content">
                {{item.remark}}
              </div>
            </div>
          </div>
        </el-scrollbar>
      </el-tab-pane> -->
      <!-- 跟进记录 end -->

      <!-- 客户跟进资料 开始 -->
      <el-tab-pane label="客户附件管理" name="3">
        <el-form class="el_form" :model="selectItem" label-width="120px">
          <!-- <el-form-item label="进度">
            <el-select v-model="selectItem.progress" clearable placeholder="跟进状态">
              <el-option v-for="item in statusList" :key="item.status" :label="item.desc" :value="item.status" />
            </el-select>
          </el-form-item>
          <el-form-item label="通话状态">
            <el-select v-model="selectItem.call" clearable placeholder="通话状态">
              <el-option v-for="item in PASSOPTIONSLIST" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="是否是有效客户">
            <el-select v-model="selectItem.fit" clearable placeholder="是否有效">
              <el-option v-for="item in EFFECTIVEOPTIONS" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item> -->
          <!-- <el-form-item label="预约上门">
            <el-date-picker v-model="selectItem.appointmentDate" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="选择日期时间">
            </el-date-picker>
          </el-form-item> -->

          <!-- <el-form-item label="跟进记录">
          <el-input type="textarea" :rows="5" :resize="inputResize" v-model="input" placeholder="请输入跟进记录，不超过50个字"></el-input>
        </el-form-item> -->
          <el-form-item label="上传跟进资料" class="el_long">
            <div class="upload_box">
              <div class="image_cell">
                <el-upload class="avatar-uploader" :action="UPLOADFILEPATH" :show-file-list="false"
                  :on-success="(response) => onSuccess(response, 'idcardFront')">
                  <img v-if="selectItem.idcardFront" :src="selectItem.idcardFront" class="avatar">
                  <div class="upload_tips" v-else>
                    <i class="el-icon-plus avatar-uploader-icon"></i>
                    <span>上传身份证正面</span>
                  </div>
                </el-upload>
                <span class="name">身份证正面</span>
              </div>
              <div class="image_cell">
                <el-upload class="avatar-uploader" :action="UPLOADFILEPATH" :show-file-list="false"
                  :on-success="(response) => onSuccess(response, 'idcardBack')">
                  <img v-if="selectItem.idcardBack" :src="selectItem.idcardBack" class="avatar">
                  <div class="upload_tips" v-else>
                    <i class="el-icon-plus avatar-uploader-icon"></i>
                    <span>上传身份证反面</span>
                  </div>
                </el-upload>
                <span class="name">身份证反面</span>
              </div>
            </div>
          </el-form-item>
          <el-form-item label="必备资料" class="el_long">
            <div class="upload_box">
              <div class="image_cell">
                <el-upload class="avatar-uploader" :action="UPLOADFILEPATH" :show-file-list="false"
                  :on-success="(response) => onSuccess(response, 'authorizeFile')">
                  <img v-if="selectItem.authorizeFile" :src="selectItem.authorizeFile" class="avatar">
                  <div class="upload_tips" v-else>
                    <i class="el-icon-plus avatar-uploader-icon"></i>
                    <span>上传授权书</span>
                  </div>
                </el-upload>
                <span class="name">授权书</span>
              </div>
              <div class="image_cell">
                <el-upload class="avatar-uploader" :action="UPLOADFILEPATH" :show-file-list="false"
                  :on-success="(response) => onSuccess(response, 'creditFile')">
                  <img v-if="selectItem.creditFile" :src="selectItem.creditFile" class="avatar">
                  <div class="upload_tips" v-else>
                    <i class="el-icon-plus avatar-uploader-icon"></i>
                    <span>上传征信报告</span>
                  </div>
                </el-upload>
                <span class="name">征信报告</span>
              </div>
            </div>
          </el-form-item>
          <el-form-item label="其他资料" class="el_long">
            <div class="upload_box">
              <el-upload class="avatar-uploader" :action="UPLOADFILEPATH" list-type="picture-card" :file-list="otherFile"
                :on-success="onFileSucess">
                <i class="el-icon-plus"></i>
              </el-upload>
            </div>
          </el-form-item>
        </el-form>
      </el-tab-pane>
      <!-- 客户跟进资料 end -->

      <!-- 签约产品 开始 -->
      <el-tab-pane label="签约产品" name="4">
        <el-table :data="selectItem.productList" border size="small">
          <el-table-column label="id" prop="productId"></el-table-column>
          <el-table-column label="产品" prop="productName"></el-table-column>
          <el-table-column label="备注" prop="remark"></el-table-column>
          <el-table-column label="进度" prop="process">
            <template slot-scope="{row}">{{ PRODUCTPROCESSLIST[row.process] }}</template>
          </el-table-column>
          <el-table-column label="完成凭证" prop="certificate">
            <template slot-scope="{row}">
              <el-image class="el_img" :src="row.certificate" :preview-src-list="[row.certificate]"
                v-if="row.certificate"></el-image>
            </template>
          </el-table-column>
          <el-table-column label="操作" prop="" width="240" align="center">
            <template slot-scope="{row}">
              <div class="links_box">
                <el-button type="primary" size="mini" v-if="row.process != 2"
                  @click="updateProduct(row, 1, $index)">处理中</el-button>
                <el-button type="primary" size="mini" v-if="row.process != 2"
                  @click="updateProduct(row, 2, $index)">完成</el-button>
                <el-upload class="upload-demo" :action="UPLOADFILEPATH" :show-file-list="false"
                  :on-success="e => onFileSuccess(e, row, $index)">
                  <el-button type="primary" size="mini">上传凭证</el-button>
                </el-upload>
              </div>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <!-- 签约产品 end -->

    </el-tabs>

    <!-- 标记为第三方产品 开始 -->
    <glsx-dialog :show="showDialog" title="标记为第三方产品" width="30%" :appendtobody="true" @close="closeDialog()">
      <div class="popup_box">
        <h2 class="h2">确认标记为不符合产品客户？</h2>
        <div class="cell">
          <span class="name">理由：</span>
          <el-input type="textarea" v-model="remark" resize="none" rows="5"
            placeholder="请输入标记为不合符产品客户理由，以及客户真实需求"></el-input>
        </div>
      </div>
      <template slot="footer">
        <el-button type="primary" size="small" @click="saveRemark()">确定</el-button>
        <el-button type="default" size="small" @click="closeDialog()">取消</el-button>
      </template>
    </glsx-dialog>
    <!-- 标记为第三方产品 end -->

    <!-- 添加标签 开始 -->
    <glsx-dialog :show="showTagDialog" title="选择标签" width="30%" :appendtobody="true" @close="closeTagDialog()">
      <div class="tag_dialog">
        <h2 class="h2">选择客户标签：</h2>
        <div class="tags_list">
          <el-tag class="el_tag" v-for="(item, index) in tagList" :key="index"
            :effect="activeTags(item) ? 'dark' : 'plain'" @click="chooseTag(item)">
            {{ item.name }}
          </el-tag>
        </div>
      </div>
      <template slot="footer">
        <el-button type="primary" size="small" @click="saveTags()">确定</el-button>
        <el-button type="default" size="small" @click="closeTagDialog()">取消</el-button>
      </template>
    </glsx-dialog>
    <!-- 添加标签 end -->

    <!-- 预约跟进 开始 -->
    <!-- <glsx-dialog :show="showBookDialog" title="预约跟进" width="30%" :appendtobody="true" @close="closeBookDialog">
      <follow-book v-if="showBookDialog" :id="selectItem.id" :name="selectItem.name" :phone="selectItem.mobile" @change="onChange"></follow-book>
    </glsx-dialog> -->
    <follow-book v-model="showBookDialog" :id="selectItem.id" :name="selectItem.name"
      :phone="selectItem.mobile"></follow-book>
    <!-- 预约跟进 end -->

  </div>
</template>
<script>
import {
  SAVECUSTOMERFILES,
  updateCustomer,
  UPLOADFILEPATH,
  GETCUSTOMERSTATUS,
  UPDATEPRODUCTPROCESS,
} from "@/api/customer";
import {
  SAVE_THIRD_PARTY,
  GET_ALL_LABEL,
  GET_CUSSTOMER_INFO,
  SAVE_CUSTOMER_LABEL,
  SAVE_CUSTOMER_LOCK
} from "@/http/customer";
import {
  FOLLOWUPOPTIONSLIST,
  FOLLOWUPOPTIONS,
  PASSOPTIONSLIST,
  EFFECTIVEOPTIONS,
  PRODUCTPROCESSLIST,
} from "@/common/constants";
import moment from "moment";
import {
  showToast,
  deepClone,
  showFollowProcess,
  showModal,
  broadcast,
} from "@/utils/util";
import GlsxDialog from "../Dialog";
import CitySelect from "@/components/city";
import { ADD_CUSTOMER_POOL } from "@/http/customer";
import { MODIFY_CUSTOMER_PROCESS } from "@/http/public";
import FollowBook from "./book";
export default {
  name: "FollowUp",
  props: {
    data: {
      type: Object,
      default: () => {
        return {};
      },
    },
    list: {
      type: Array,
      default: function () {
        return [];
      },
    },
    id: {
      type: [String, Number],
      default: "",
    },
  },
  components: {
    GlsxDialog,
    CitySelect,
    FollowBook,
  },
  data() {
    return {
      activeName: "1",
      selectItem: {},
      FOLLOWUPOPTIONSLIST: FOLLOWUPOPTIONSLIST,
      FOLLOWUPOPTIONS: FOLLOWUPOPTIONS,
      PASSOPTIONSLIST: PASSOPTIONSLIST,
      EFFECTIVEOPTIONS: EFFECTIVEOPTIONS,
      fieldList: this.$store.state.myClient.fieldList,
      inputResize: "none",
      UPLOADFILEPATH: UPLOADFILEPATH,
      value1: "",
      input: "",
      statusList: [],
      PRODUCTPROCESSLIST,
      otherFile: [],
      showDialog: false,
      remark: "",
      tagList: [],
      tagCheckList: [],
      showTagDialog: false,
      checkList: [],
      showFollowProcess: (str) => showFollowProcess(str),
      showBookDialog: false,
    };
  },
  mounted() {
    let o = this.data;
    console.log(o.otherFile);
    // o.progress = o.progress ? o.progress.toString() : "";
    // this.selectItem = o;
    //this.initCustomer(o);
    this.getInfo(o);
    // if (o.otherFile) {
    //   let m = o.otherFile.split(",");
    //   let arr = [];
    //   m.map((k) => {
    //     arr.push({ name: k, url: k });
    //   });
    //   this.otherFile = arr;
    // }
    this.getStatus();
    this.getLabels();
    // if (o.label) {
      this.getTags(o.label);
    // }
  },
  methods: {
    // 是否禁用去签约按钮
    disabledSign() {
      let o = this.selectItem;
      if (
        !o.idcardFront ||
        !o.idcardBack ||
        !o.authorizeFile ||
        !o.authorizeFile
      ) {
        return true;
      }
      return false;
    },

    // 去签约
    goSign(type) {
      let o = this.selectItem;
      let oParams = {
        name: o.name,
        mobile: o.mobile,
        id: o.id,
        type: type || 0,
      };
      console.log(oParams)
      // this.$router.push({
      //   name: "addContract",
      //   query: oParams,
      // });
      // this.$emit("change", true);
      broadcast("look.user.sign", oParams);
    },

    // 上传其他资料
    onFileSucess(res, file, fileList) {
      if (res.code != 200) {
        return false;
      }
      let list = this.otherFile || [];
      list.push({ name: res.data, url: res.data });

      let arr = [];
      list.map((k) => {
        arr.push(k.url);
      });
      this.saveFiles("otherFile", arr.toString());
    },

    // 监听文件上传成功
    onSuccess(res, id) {
      if (res.code == 200) {
        this.$set(this.selectItem, id, res.data);
        this.saveFiles(id, res.data);
      }
    },

    // 保存文件资料
    saveFiles(id, url) {
      if (!id || !url) {
        return false;
      }
      let oParams = {};
      oParams.id = this.selectItem.id;
      oParams[id] = url;
      SAVECUSTOMERFILES(oParams);
    },

    // 保存数据
    saveInfo(type) {
      let _this = this;
      // 编辑客户
      const { progress, id, level, remark, call, fit, name, city, sex } =
        this.selectItem;
      const form = { progress, id, level, remark, call, fit, name, city, sex };

      if (this.value1) {
        // 预约上门时间
        form.appointmentDate = this.value1;
      }
      for (const key in this.selectItem) {
        if (Object.hasOwnProperty.call(this.selectItem, key)) {
          if (key.indexOf("field") > -1) {
            form[key] = this.selectItem[key];
          }
        }
      }
      if (this.input) {
        form.customerRemark = { remark: this.input };
      }

      let arr = [];
      this.checkList.map((k) => {
        arr.push(k.name);
      });
      form.label = arr.toString();
      updateCustomer(form)
        .then((res) => {
          //this.$refs.params.search();
          this.$message.success(res.message);
          if (type == "follow") {
            this.insertInfo(res.data);
            return false;
          }

          if (type == "tags") {
            this.closeTagDialog();
            return false;
          }

          _this.$emit("change", false);
        })
        .catch((error) => {
          _this.$emit("change");
        });
    },

    // 获取状态
    getStatus() {
      GETCUSTOMERSTATUS().then((res) => {
        let list = res.data || [];
        list.map((k) => {
          k.id = Number(k.status);
          return k;
        });
        this.statusList = list;
      });
    },

    // 插入跟进信息
    insertInfo(str) {
      let list = this.selectItem.remarkList;
      let o = {};
      o.createBy = str;
      o.updateDate = moment().format("YYYY-MM-DD HH:mm:ss");
      o.remark = this.input;
      list.unshift(o);
      this.$set(this.selectItem, "remarkList", list);
      this.input = "";
    },

    // 更新产品状态
    updateProduct(row, id, idx) {
      let _this = this;
      let oParams = {};
      oParams.id = row.id;
      oParams.process = id || row.process;
      oParams.certificate = row.certificate;
      oParams.remark = row.remark;
      UPDATEPRODUCTPROCESS(oParams).then((res) => {
        if (res.code == 200 && id) {
          showToast({
            message: "操作成功",
            type: "success",
          });
          row.process = id;
          _this.$set(this.selectItem, idx, row);
        }
      });
    },

    // 监听文件上传成功
    onFileSuccess(e, row, idx) {
      if (e.code != 200) {
        return false;
      }
      showToast({
        message: "上传成功",
        type: "success",
      });
      row.certificate = e.data;
      this.$set(this.selectItem, idx, row);
      this.updateProduct(row);
    },

    // 打开弹框
    openDialog() {
      this.showDialog = true;
    },

    // 关闭弹框
    closeDialog() {
      this.showDialog = false;
      this.remark = "";
    },

    // 保存数据
    saveRemark() {
      if (!this.remark) {
        showToast({
          message: "请输入理由",
        });
        return false;
      }

      let oParams = {};
      oParams.id = this.selectItem.id;
      oParams.remark = this.remark;
      SAVE_THIRD_PARTY(oParams).then((res) => {
        if (res.code == 200) {
          showToast({
            message: "操作成功",
            type: "success",
          });
          this.closeDialog();
        }
      });
    },

    // 展示标签
    getTags(str) {
      let list = [];
      if (!str) {
        this.checkList = list;
        return false;
      }
      let _this = this;
      let arr = str.split(",");

      arr.map((k) => {
        list.push({ name: k, id: Math.random() });
      });
      this.checkList = list;
    },

    // 获取所有标签
    getLabels() {
      GET_ALL_LABEL().then((res) => {
        let list = res.data || [];
        this.tagList = list;
      });
    },

    // 关闭标签弹框
    closeTagDialog() {
      this.showTagDialog = false;
    },

    // 打开标签弹框
    openTagDialog() {
      this.showTagDialog = true;
      this.tagCheckList = deepClone(this.checkList);
    },

    // 添加标签
    saveTags() {
      let _this = this;
      let list = this.tagCheckList;
      if (!list || list.length <= 0) {
        showToast({
          message: "请选择标签!",
        });
        return false;
      }
      let arr = [];
      list.map((k) => {
        arr.push(k.name);
      });
      console.log(arr);
      let oParams = {};
      oParams.id = this.selectItem.id;
      oParams.label = arr.toString();
      SAVE_CUSTOMER_LABEL(oParams).then((res) => {
        if (res.code == 200) {
          showToast({
            message: "操作成功",
            type: "success",
          });
          _this.closeTagDialog();
          _this.$set(_this.selectItem, "labels", arr.toString());
          _this.checkList = deepClone(_this.tagCheckList);
        }
      });
    },

    // 判断是否选中标签
    activeTags(item) {
      let list = this.tagCheckList;
      let idx = list.findIndex((k) => k.name == item.name);
      if (idx >= 0) {
        return true;
      } else {
        return false;
      }
    },

    // 选中标签
    chooseTag(item) {
      let list = deepClone(this.tagCheckList);
      let idx = list.findIndex((k) => k.name == item.name);
      if (idx >= 0) {
        list = list.filter((k) => k.name != item.name);
      } else {
        list.push(item);
      }
      console.log(this.checkList);
      this.tagCheckList = list;
    },

    // 初始化图片
    initCustomer(row) {
      console.log(row);
      let arr = [];
      if (row && row.otherFile) {
        let m = row.otherFile.split(",");
        m.map((k) => {
          arr.push({ name: k, url: k });
        });
        this.otherFile = arr;
      }
      row.progress = row.progress ? row.progress.toString() : "";

      // if (row.label) {
        this.getTags(row.label);
      // }
      this.selectItem = row;
    },

    // 查看上一个客户
    lookPrevCustomer() {
      let row = this.selectItem;
      let list = this.list;
      let idx = list.findIndex((k) => k.id == row.id);
      console.log(idx);
      if (idx == 0) {
        showToast({
          message: "已是第一个客户",
        });
        return false;
      }
      let o = list[idx - 1];
      this.getInfo(o);
    },

    // 查看下一个客户
    lookNextCustomer() {
      let row = this.selectItem;
      let list = this.list;
      let idx = list.findIndex((k) => k.id == row.id);
      console.log(idx);
      if (idx == list.length - 1) {
        showToast({
          message: "已是最后一个客户",
        });
        return false;
      }
      let o = list[idx + 1];
      this.getInfo(o);
    },

    // 判断用户是否为第一个或者最后一个
    isFirstCustomer() {
      let row = this.selectItem;
      let list = this.list;
      let idx = list.findIndex((k) => k.id == row.id);
      if (idx == 0) {
        return true;
      }
      return false;
    },

    // 判断用户是否为最后一个
    isLastCustomer() {
      let row = this.selectItem;
      let list = this.list;
      let idx = list.findIndex((k) => k.id == row.id);
      if (idx == list.length - 1) {
        return true;
      }
      return false;
    },

    // 加入公共池
    joininPublicPool() {
      let _this = this;
      let row = this.selectItem;

      showModal({
        message: "确认加入公共池?",
        showCancelButton: true,
        success: function () {
          ADD_CUSTOMER_POOL({ idList: [row.id] }).then((res) => {
            if (res.code == 200) {
              showToast({
                message: res.message,
                type: "success",
              });
              //_this.$refs.params.search();
              broadcast("update.success");
            }
          });
        },
      });
    },

    // 获取客户详情
    getInfo(row) {
      GET_CUSSTOMER_INFO({ id: row.id }).then((res) => {
        let obj = res.data || {};
        console.log(obj);
        this.initCustomer(obj);
      });
    },

    // 进件
    goFollow(row) {
      console.log(row);
      broadcast("look.user.into", row);
    },

    // 修改用户状态
    editProgress(row) {
      let _this = this;
      let o = this.data;
      let n = this.selectItem;
      console.log(n.progress);
      console.log(row);
      if (row.status <= n.progress) {
        return false;
      }
      showModal({
        message: `确认修改状态为：${row.desc}?`,
        showCancelButton: true,
        type: "warning",
        success: function () {
          let oParams = {};
          oParams.id = o.id;
          oParams.progress = row.status;
          MODIFY_CUSTOMER_PROCESS(oParams).then((res) => {
            if (res.code == 200) {
              showToast({
                message: "修改成功",
                type: "success",
              });
              _this.$set(_this.selectItem, "progress", Number(row.status));
            }
          });
        },
      });
    },

    // 打开预约跟进弹框
    openBookDialog() {
      this.showBookDialog = true;
      console.log(this.selectItem);
    },

    // 关闭预约跟进弹框
    closeBookDialog() {
      this.showBookDialog = false;
    },

    // 锁定客户
    lockUser(row) {
      let _this = this;
      console.log(row)
      let msg = '锁定为重要客户,重点跟进,一定时间内其他人无法转移'
      let params = {}
      params.id = row.id
      if(row.lock == 1){
        params.lock = 0;
        msg = '确定取消锁定改客户吗？'
      }else{
        params.lock = 1;
        msg = '锁定为重要客户,重点跟进,一定时间内其他人无法转移'
      }
      showModal({
        message: msg,
        showCancelButton: true,
        type: "warning",
        success: function () {
          SAVE_CUSTOMER_LOCK(params).then(res => {
            if (res.code == 200) {
              showToast({
                message: "操作成功",
                type: "success",
              });
              _this.$set(_this.selectItem,'lock',params.lock)
            }
          })

        },
      });
    }

  },
};
</script>
<style lang="scss" scoped>
@import "@/styles/followup.scss";
</style>